<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-4.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head lang="en" th:include="crowd-wap/head/link::header">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"/>
    <meta name="format-detection" content="telephone=no"/>
    <meta name="format-detection" content="email=no"/>
    <meta charset="UTF-8">


    <title>众财经</title>


</head>
<style>

    .headd{
        width: 100%;height: 4rem;
    }
    .headsi{
        height: 2.5rem;width: 100%;border-bottom: 0.001rem #cccccc solid;
    }
    .si{
        height: 2.5rem;width: 1.85rem;float: left;text-align:center;line-height:1.85rem;
    }
    .siimg{
        width: 1.1rem;height: 1.1rem;margin:0 auto;padding-top: 0.4rem;
    }
    .siimg img{
        width: 1.1rem;height: 1.1rem;margin:0 auto
    }
    .sitext{
        height: 1rem;width: 100%;text-align:center;line-height:1rem;font-size: 0.2rem;color: #545454;
    }
    .di{
        width: 100%;height: 1.5rem;float: left;text-align:center;line-height:1.5rem;
    }
    .disi{
        height: 1.5rem;width: 1.85rem;float: left;text-align:center;line-height:1.5rem;
    }
    .disip1{
        height:0.7rem;font-size: 0.3rem;line-height: 0.8rem;color: red;
    }
    .disip2{
        height:0.8rem;font-size: 0.2rem;line-height: 0.7rem;color: #545454
    }

</style>
<style>
    .lunbo {
        list-style:none;
    }
    .news {
        height:50px;
        background: #f2f2f2;
        overflow:hidden;

    }
    .news .t_news {
        height:30px;
        color: #000000;
        margin-top:5px;
        overflow:hidden;
        position:relative;
        width:100%;

    }
    .news .news_li,.swap {
        line-height:30px;
        display:inline-block;
        position:absolute;
        top:0;
        left:0.8rem;
        font-size:25px;

        color: #000000
    }
    .news .swap {
        top:23px;
    }
</style>
<body >

    <header>首页<b onclick="window.location.href='help.html'"></b></header>
    <input id="memberId" type="hidden" th:value="${session.memberId}">
    <div id="banner_tabs" class="flexslider">
        <ul class="slides">
            <li>
                <a title="" onclick="tolingqu()">
                    <img alt="" style="width:100%;height: 3.5rem;" src="http://60.208.57.115:15809/tracer/crowd/2019-07-09/230ce5fa491141bf8e50cd875c8f4bf0.jpeg" class="bannerSlider">
                </a>
            </li>
            <li  th:each="adv,iterStat:${informationAdvertisementList}">
                <a title="" th:href="${adv.webUrl}">
                    <img alt="" style="width:100%;height: 3.5rem;" th:src="@{${adv.logoUrl}}" class="bannerSlider">
                </a>

            </li>

        </ul>

    </div>
    <div class="news">
        <div class="t_news">
            <div style="margin-left: 0.2rem;margin-top: 0.05rem"><img th:src="@{${session.baseUrl}+'images/index/tz.png'}"/></div>
            <ul class="news_li" id="ullun" >
                <span th:each="tai,iterStat:${pingtai}">
                    <li class="lunbo">
                        <a style="text-decoration:none;color:#323232;" th:href="@{/wap/InformationNews/newsDetail.html/(newsId=${tai.id})}" th:text="${tai.title}"></a>
                    </li>
                </span>
            </ul>

        </div>
    </div>

    <div class="headd" style="background-color: white;">
        <div class="headsi">
            <div class="si">
                <div class="siimg">
                    <a th:href="@{/wap/InformationAbout/profile.html}">
                        <img th:src="@{${session.baseUrl}+'images/index/app-in09.png'}"/>
                    </a>
                </div>
                <div class="sitext"><span>公司简介</span></div>
            </div>
            <div class="si">
                <div class="siimg">
                    <a th:href="@{/wap/InformationNews/news1.html}">
                        <img th:src="@{${session.baseUrl}+'images/index/app-in08.png'}"/>
                    </a>
                </div>
                <div class="sitext"><span>新闻公告</span></div>
            </div>
            <div class="si">
                <div class="siimg">
                    <a th:href="@{/wap/help.html}">
                        <img th:src="@{${session.baseUrl}+'images/index/app-in06.png'}"/>
                    </a>
                </div>
                <div class="sitext"><span>常见问题</span></div>
            </div>
            <div class="si">
                <div class="siimg">
                    <a th:href="@{/wap/InformationAbout/contact1.html}">
                        <img th:src="@{${session.baseUrl}+'images/index/app-in04.png'}"/>
                    </a>
                </div>
                <div class="sitext"><span>联系我们</span></div>
            </div>
        </div>
        <div class="di">
            <div class="disi">
                <p class="disip1" align="center" th:text="${basicTable.totalTurnover}+'元'"></p>
                <p class="disip2" align="center">交易总额</p>

            </div>
            <div class="disi">
                <p class="disip1" align="center" th:text="${basicTable.totalProfit}+'元'"></p>
                <p class="disip2" align="center">赚取收益</p>

            </div>
            <div class="disi">
                <p class="disip1" align="center" th:text="${basicTable.investors}+'人'"></p>
                <p class="disip2" align="center">参与人数</p>

            </div>
            <div class="disi">
                <p class="disip1" align="center" th:text="${basicTable.registrar}+'人'"></p>
                <p class="disip2" align="center">注册人数</p>

            </div>
        </div>
    </div>
    <!--明星项目-->
    <div style=" width: 100%;background-color: white;">
        <span  style=" text-align:center;background-color: #f2f2f2;display:block;color:#000000;font-size: 0.35rem;line-height: 0.7rem;padding-left: 0.3rem;">明星项目</span>
        <div th:if="${star==null }">
            <img th:src="@{${session.baseUrl}+'\images\zanwu.png'}" style="width: 980px;height:335px;"/>
        </div>

        <ul id="mx" th:if="${star!=null}">
            <input type="hidden" id="projectId" th:value="${star.id}">
            <a href="/wap/buy.html" th:href="@{/wap/buy.html/(projectId=${star.id})}">

                <li >

                    <img th:src="@{${session.baseUrl}+'images/projectDetail/mxxm2.png'}" alt="明星项目"/>
                    <div style="width: 4rem;height: 2rem;">
                        <div style="width: 3rem;height: 0.5rem;float: right;">
                            <span th:text="${star.name}" style="font-size:0.25rem;color: black;float: left; width: 3.2rem;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;"></span>

                        </div>
                        <div th:if="${star.status}==0" style="width: 1rem;height: 0.5rem;margin-left: 3rem;margin-top: -0.45rem">
                            <span style="border: 1px solid #f64e4d;color: #f64e4d;font-size: 0.2rem;border-radius: 20px;font-weight:bold;width: 0.8rem;padding: 0.1rem 0.1rem">预热中</span>
                        </div>
                        <div th:if="${star.status}==3" style="width: 1rem;height: 0.5rem;margin-left: 3rem;margin-top: -0.45rem">
                            <span style="border: 1px solid black;color: black;font-size: 0.2rem;border-radius: 20px;font-weight:bold;width: 0.8rem;padding: 0.1rem 0.1rem">已结束</span>
                        </div>
                        <div th:if="${star.status}==5" style="width: 1rem;height: 0.5rem;margin-left: 3rem;margin-top: -0.45rem">
                            <span style="border: 1px solid red;color: red;font-size: 0.2rem;border-radius: 20px;font-weight:bold;width: 0.8rem;padding: 0.1rem 0.1rem">已满额</span>
                        </div>
                        <div style="width: 4.2rem;height: 1.5rem;margin-left: -0.2rem">
                            <div style="width: 1.4rem;height: 1.5rem;float: left;">
                                <p style="font-size: 0.3rem;padding-top: 0.3rem" align="center" th:text="'¥'+${star.currentTotal}"></p>
                                <p style="color:#707070;font-size: 0.2rem;padding-top: 0.3rem" align="center">已投金额</p>
                            </div>

                            <div style="width: 1.4rem;height: 1.5rem;float: left;">
                                <p style="color:red;font-weight: bolder;font-size: 0.4rem;padding-top: 0.2rem" align="center" th:text="${#numbers.formatDecimal(100*star.rate,1,2)}+'%'"></p>
                                <p style="color:#707070;font-size: 0.2rem;padding-top: 0.3rem" align="center">年化率</p>
                            </div>
                            <div style="width: 1.4rem;height: 1.5rem;float: left" th:if="${star.status!=0}">
                                <p style="font-size: 0.3rem;padding-top: 0.3rem" align="center" th:text="${star.dayNum}+'天'"></p>
                                <p style="color:#707070;font-size: 0.2rem;padding-top: 0.3rem" align="center">项目期限</p>
                            </div>
                            <div style="width: 1.4rem;height: 1.5rem;float: left" th:if="${star.status==0}">
                                <p style="font-size: 0.3rem;padding-top: 0.3rem" align="center" th:text="${yureDay}+'天'"></p>
                                <p style="color:#707070;font-size: 0.2rem;padding-top: 0.3rem" align="center">剩余天数</p>
                            </div>
                        </div>
                        <div style="height: 0.15rem">
                            <div class="container">
                                <div class="child"></div>
                            </div><span class="num" style="float: right;margin-top: -0.15rem;" th:text="${#numbers.formatDecimal(100*star.infoD,1,2)}+'%'"></span>
                        </div>
                    </div>
                </li>
                </div>
            </a>

        </ul>
    </div>

    <!--优秀项目-->
    <div style="width: 100%; background-color: white;">
        <span  style="text-align:center; background-color: #f2f2f2;display:block;color:#000000;font-size: 0.35rem;line-height: 0.7rem;padding-left: 0.3rem;">优秀项目</span>
        <div th:if="${excellent==null || excellent.size()==0}">
            <img th:src="@{${session.baseUrl}+'\images\zanwu.png'}" style="width: 980px;height:335px;"/>
        </div>
        <ul id="content"  th:each="excellent,iterStat:${excellent}" th:if="${excellent!=null}">
            <input type="hidden" id="projectId1" th:value="${excellent.id}">
            <a href="/wap/buy.html" th:href="@{/wap/buy.html/(projectId=${excellent.id})}">

                <li >
                    <img th:src="@{${session.baseUrl}+'images/projectDetail/yx.png'}" alt="优秀项目"/>
                    <div style="width: 4rem;height: 2rem;">
                        <div style="width: 3rem;height: 0.5rem;float: right;">
                            <span th:text="${excellent.name}" style="font-size:0.25rem;color: black;float: left; width: 3.2rem;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;"></span>

                        </div>
                        <div th:if="${excellent.status}==0" style="width: 1rem;height: 0.5rem;margin-left: 3rem;margin-top: -0.45rem">
                            <span style="border: 1px solid #f64e4d;color: #f64e4d;font-size: 0.2rem;border-radius: 20px;font-weight:bold;width: 0.8rem;padding: 0.1rem 0.1rem">预热中</span>
                        </div>
                        <div th:if="${excellent.status}==3" style="width: 1rem;height: 0.5rem;margin-left: 3rem;margin-top: -0.45rem">
                            <span style="border: 1px solid black;color: black;font-size: 0.2rem;border-radius: 20px;font-weight:bold;width: 0.8rem;padding: 0.1rem 0.1rem">已结束</span>
                        </div>
                        <div th:if="${excellent.status}==5" style="width: 1rem;height: 0.5rem;margin-left: 3rem;margin-top: -0.45rem">
                            <span style="border: 1px solid red;color: red;font-size: 0.2rem;border-radius: 20px;font-weight:bold;width: 0.8rem;padding: 0.1rem 0.1rem">已满额</span>
                        </div>
                        <div style="width: 4.2rem;height: 1.5rem;margin-left: -0.2rem">
                            <div style="width: 1.4rem;height: 1.5rem;float: left;">
                                <p style="font-size: 0.3rem;padding-top: 0.3rem" align="center" th:text="'¥'+${excellent.currentTotal}"></p>
                                <p style="color:#707070;font-size: 0.2rem;padding-top: 0.3rem" align="center">已投金额</p>
                            </div>

                            <div style="width: 1.4rem;height: 1.5rem;float: left;">
                                <p style="color:red;font-weight: bolder;font-size: 0.4rem;padding-top: 0.2rem" align="center" th:text="${#numbers.formatDecimal(100*excellent.rate,1,2)}+'%'"></p>
                                <p style="color:#707070;font-size: 0.2rem;padding-top: 0.3rem" align="center">年化率</p>
                            </div>
                            <div style="width: 1.4rem;height: 1.5rem;float: left" th:if="${excellent.status!=0}">
                                <p style="font-size: 0.3rem;padding-top: 0.3rem" align="center" th:text="${excellent.dayNum}+'天'"></p>
                                <p style="color:#707070;font-size: 0.2rem;padding-top: 0.3rem" align="center">项目期限</p>
                            </div>
                            <div style="width: 1.4rem;height: 1.5rem;float: left" th:if="${excellent.status==0}">
                                <p style="font-size: 0.3rem;padding-top: 0.3rem" align="center" th:text="${yureDay}+'天'"></p>
                                <p style="color:#707070;font-size: 0.2rem;padding-top: 0.3rem" align="center">剩余天数</p>
                            </div>
                        </div>
                        <div style="height: 0.15rem">
                            <div class="container">
                                <div class="child"></div>
                            </div><span class="num" style="float: right;margin-top: -0.15rem;" th:text="${#numbers.formatDecimal(100*excellent.infoD,1,2)}+'%'"></span>
                        </div>
                    </div>
                </li>
            </a>

        </ul>
    </div>

<!--性价比项目-->
    <div style="border-bottom: 0.4rem solid #f2f2f2; width: 100%;background-color: white; ">
        <span  style="text-align:center;background-color: #f2f2f2;display:block;color:#000000;font-size: 0.35rem;line-height: 0.7rem;padding-left: 0.3rem;">性价比项目</span>
        <div th:if="${commonly==null || commonly.size()==0}">
            <img th:src="@{${session.baseUrl}+'\images\zanwu.png'}" style="width: 980px;height:335px;"/>
        </div>
        <div th:if="${commonly!=null}">
            <ul id="xjb"  th:each="commonly,iterStat:${commonly}" th:if="${iterStat.count}<=4">
                <input type="hidden" id="projectId2" th:value="${commonly.id}">
                <a href="/wap/buy.html" th:href="@{/wap/buy.html/(projectId=${commonly.id})}">

                    <li >
                        <img th:src="@{${session.baseUrl}+'images/projectDetail/xjbxm.png'}" alt="性价比项目"/>
                        <div style="width: 4rem;height: 2rem;">
                            <div style="width: 3rem;height: 0.5rem;float: right;">
                                <span th:text="${commonly.name}" style="font-size:0.25rem;color: black; float: left; width: 3.2rem;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;"></span>

                            </div>
                            <div th:if="${commonly.status}==0" style="width: 1rem;height: 0.5rem;margin-left: 3rem;margin-top: -0.45rem">
                                <span style="border: 1px solid #f64e4d;color: #f64e4d;font-size: 0.2rem;border-radius: 20px;font-weight:bold;width: 0.8rem;padding: 0.1rem 0.1rem">预热中</span>
                            </div>
                            <div th:if="${commonly.status}==3" style="width: 1rem;height: 0.5rem;margin-left: 3rem;margin-top: -0.45rem">
                                <span style="border: 1px solid black;color: black;font-size: 0.2rem;border-radius: 20px;font-weight:bold;width: 0.8rem;padding: 0.1rem 0.1rem">已结束</span>
                            </div>
                            <div th:if="${commonly.status}==5" style="width: 1rem;height: 0.5rem;margin-left: 3rem;margin-top: -0.45rem">
                                <span style="border: 1px solid red;color: red;font-size: 0.2rem;border-radius: 20px;font-weight:bold;width: 0.8rem;padding: 0.1rem 0.1rem">已满额</span>
                            </div>
                            <div style="width: 4.2rem;height: 1.5rem;margin-left: -0.2rem">
                                <div style="width: 1.4rem;height: 1.5rem;float: left;">
                                    <p style="font-size: 0.3rem;padding-top: 0.3rem" align="center" th:text="'¥'+${commonly.currentTotal}"></p>
                                    <p style="color:#707070;font-size: 0.2rem;padding-top: 0.3rem" align="center">已投金额</p>
                                </div>

                                <div style="width: 1.4rem;height: 1.5rem;float: left;">
                                    <p style="color:red;font-weight: bolder;font-size: 0.4rem;padding-top: 0.2rem" align="center" th:text="${#numbers.formatDecimal(100*commonly.rate,1,2)}+'%'"></p>
                                    <p style="color:#707070;font-size: 0.2rem;padding-top: 0.3rem" align="center">年化率</p>
                                </div>
                                <div style="width: 1.4rem;height: 1.5rem;float: left" th:if="${commonly.status!=0}">
                                    <p style="font-size: 0.3rem;padding-top: 0.3rem" align="center" th:text="${commonly.dayNum}+'天'"></p>
                                    <p style="color:#707070;font-size: 0.2rem;padding-top: 0.3rem" align="center">项目期限</p>
                                </div>
                                <div style="width: 1.4rem;height: 1.5rem;float: left" th:if="${commonly.status==0}">
                                    <p style="font-size: 0.3rem;padding-top: 0.3rem" align="center" th:text="${yureDay}+'天'"></p>
                                    <p style="color:#707070;font-size: 0.2rem;padding-top: 0.3rem" align="center">剩余天数</p>
                                </div>
                            </div>
                            <div style="height: 0.15rem">
                                <div class="container">
                                    <div class="child"></div>
                                </div><span class="num" style="float: right;margin-top: -0.15rem;" th:text="${#numbers.formatDecimal(100*commonly.infoD,1,2)}+'%'"></span>
                            </div>
                        </div>
                    </li>
                </a>
            </ul>
        </div>
    </div>
    <!--<footer th:include="crowd-wap/head/link::footer"></footer>-->
    <footer th:fragment="footer">
        <ul class="df pr30 pl30 jcsa" >
            <li>
                <a th:href="@{/wap/index.html}"><p class="active">首页</p></a>
            </li>
            <li>
                <a th:href="@{/wap/crowdfunding.html}"><p>众筹</p></a>
            </li>
            <li>
                <a th:href="@{/wap/transfer.html}"><p>转让</p></a>
            </li>
            <li>
                <a th:href="@{/wap/mine.html}"><p>我的</p></a>
            </li>
        </ul>
    </footer>
</body>
<script type="text/javascript" th:inline="javascript">
    var basePath = /*[[${#httpServletRequest.getScheme() + "://" + #httpServletRequest.getServerName() + ":" + #httpServletRequest.getServerPort() + #httpServletRequest.getContextPath()}]]*/;

    $(function() {
        var bannerSlider = new Slider($('#banner_tabs'), {
            time: 5000,
            delay: 400,
            event: 'hover',
            auto: true,
            mode: 'fade',
            controller: $('#bannerCtrl'),
            activeControllerCls: 'active'
        });
//            touch.config(
//                    {
//                        tap: true,                  //tap类事件开关, 默认为true
//                        doubleTap: true,            //doubleTap事件开关， 默认为true
//                        hold: true,                 //hold事件开关, 默认为true
//                        holdTime: 650,              //hold时间长度
//                        swipe: true,                //swipe事件开关
//                        swipeTime: 300,             //触发swipe事件的最大时长
//                        swipeMinDistance: 18,       //swipe移动最小距离
//                        swipeFactor: 5,             //加速因子, 值越大变化速率越快
//                        drag: true,                 //drag事件开关
//                        pinch: true,                //pinch类事件开关
//                    }
//            );
        touch.on('.bannerSlider', 'swipeleft', function(ev){
            bannerSlider.next();
        });
        touch.on('.bannerSlider', 'swiperight', function(ev){
            bannerSlider.prev();
        });
        for(var i=0;i<$(".child").length;i++){
            $(".child").eq(i).css('width',parseInt($(".num").eq(i).text())+"%");
        }
    })


    function tolingqu() {
        var memberId = [[${session.memberId}]];
        if (memberId == null) {
            $('body').dailog({type: 'warning', title: '登录', discription: '请先登录,再领取！！'});
            self.setInterval(function () {
                window.location.href = basePath + "/wap/index.html";
            }, 2000) //这里3000代表3秒
        } else{
            window.location.href = '/wap/lingqu.html';
        }
    }

    /*function mingxing() {
        var memberId = [[${session.memberId}]];
        var projectId = $("#projectId").val();
        if (memberId == null) {
            $('body').dailog({type: 'warning', title: '登录', discription: '请先登录！'});
            self.setInterval(function () {
                window.location.href = basePath + "/wap/index.html";
            }, 2000) //这里3000代表3秒
        } else{
            window.location.href = "/wap/buy.html?projectId="+projectId;
        }
    }
    function youxiu() {
        var memberId = [[${session.memberId}]];
        var projectId1 = $("#projectId1").val();
        if (memberId == null) {
            $('body').dailog({type: 'warning', title: '登录', discription: '请先登录！'});
            self.setInterval(function () {
                window.location.href = basePath + "/wap/index.html";
            }, 2000) //这里3000代表3秒
        } else{
            window.location.href = "/wap/buy.html?projectId="+projectId1;
        }
    }function dideng() {
        var memberId = [[${session.memberId}]];
        var projectId2 = $("#projectId2").val();
        if (memberId == null) {
            $('body').dailog({type: 'warning', title: '登录', discription: '请先登录！'});
            self.setInterval(function () {
                window.location.href = basePath + "/wap/index.html";
            }, 2000) //这里3000代表3秒
        } else{
            window.location.href = "/wap/buy.html?projectId="+projectId2;
        }
    }
    function zhongchou() {
        var memberId = [[${session.memberId}]];
        if (memberId == null) {
            $('body').dailog({type: 'warning', title: '登录', discription: '请先登录,再领取！！'});
            self.setInterval(function () {
                window.location.href = basePath + "/wap/index.html";
            }, 2000)
        }else {
            window.location.href = "crowdfunding.html";
        }
    }
    function zhuanting() {
        var memberId = [[${session.memberId}]];
        if(memberId==null){
            $('body').dailog({type:'warning',title:'登录',discription:'请先登录！'});
            self.setInterval(function () {
                    window.location.href = basePath + "/wap/index.html";
                }, 2000)
        }else {
            window.location.href = "transfer.html";
        }
    }*/
</script>
<script>
    $('.swap').html($('.news_li').html());
    x = $('.news_li');

    h = $('.news_li li').length * 30; //28为每个li的高度
    var hh = $('.news_li li').length;

    if (hh > 1){
        b();
    }


    function b() {

        t = parseInt(x.css('top'));


        x.animate({
            top: t - 30 + 'px'
        }, 'slow'); //20为每个li的高度
        if (Math.abs(t) == h-30) { //20为每个li的高度
            x.animate({
                top: '0px'
            }, 'slow');

        }
        setTimeout(b, 3000); //滚动间隔时间 现在是3秒
    }
</script>
</html>